<script setup>
  import { ref, reactive, computed } from 'vue';
  import { useBreadcrumbData } from '@/stores/breadcrumb'
  import { doPost } from '@/http/api'
  import { ElMessageBox } from 'element-plus'
  import { genFileId } from 'element-plus'
  import dayjs from 'dayjs'
  
  // 面包屑数据
  const breadcrumbList = ref([
    {
      name: '首页',
      routeName: 'homeData'
    },
    {
      name: 'unicode转中文',
      routeName: ''
    },
  ]);

  const breadcrumbDataStore = useBreadcrumbData();
  breadcrumbDataStore.setBreadcrumbData(breadcrumbList);

  const inputValue = ref('');

  const handleSubmit = (type) => {
    if (type == 1 || type == 2) {
      doPost('/unicode', {
        oldStr: inputValue.value,
        type
      }).then(res => {
        inputValue.value = res.newStr;
      })
      
    } else if (type == 3) {
      inputValue.value = '';
    }
  }
</script>

<template>
  <main class="main">
    <el-input style="height: 325px;" rows="15" type="textarea" placeholder="请输入unicode编码或者中文" v-model="inputValue"></el-input>
    <div class="margin-top-bottom-10">
      <el-button type="primary" @click="handleSubmit(1)">unicode转中文</el-button>
      <el-button type="primary" @click="handleSubmit(2)">中文转unicode</el-button>
      <el-button type="primary" @click="handleSubmit(3)">清空</el-button>
    </div>

  </main>
</template>